<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../../../css/bootstrap.min.css">
<link rel="stylesheet" href="../../../css/zTreeStyle/zTreeStyle.css">
<link rel="stylesheet" href="../../../css/zTreeStyle/orgtree.css">
<link rel="stylesheet" href="../../../css/bootstrap-datetimepicker.min.css">
<script src="../../../js/jquery.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=GXeFBQcbCtv1Mz2XG0xK6PySdbju8r6L"></script>
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
</head>
<body>
		<div id="allmap"></div>
</body>
<script type="text/javascript">
	// 百度地图API功能	
	var map = new BMap.Map("allmap");  
	map.centerAndZoom(new BMap.Point(116.417854,39.921988), 15);
	//从后台取需要的数据赋值到data_info
	 $.ajax({
                type: "POST",//请求方式
                url: "/detector/detectorInfo/itemjson",//地址，就是json文件的请求路径
                dataType: "json",//数据类型可以为 text xml json  script  jsonp
　　　　　　　　　 success: function(result){//返回的参数就是 action里面所有的有get和set方法的参数
 /* alert(result.rs.data);
 					 alert(typeof(result.rs.data));
 					 console.log();
                    alert(JSON.stringify(result.rs.data)); */ 
                    var data_info= JSON.parse(result.rs.data);
                    var opts = {
            				width : 250,     // 信息窗口宽度
            				height: 80,     // 信息窗口高度
            				title : "信息窗口" , // 信息窗口标题
            				enableMessage:true//设置允许信息窗发送短息
            			   };
	            	for(var i=0;i<data_info.length;i++){
	            		var marker = new BMap.Marker(new BMap.Point(data_info[i][0],data_info[i][1]));  // 创建标注
	            		var content = data_info[i][2];
	            		map.addOverlay(marker);               // 将标注添加到地图中
	            		addClickHandler(content,marker);
	            	}
	            	function addClickHandler(content,marker){
	            		marker.addEventListener("click",function(e){
	            			openInfo(content,e)}
	            		);
	            	}
	            	function openInfo(content,e){
	            		var p = e.target;
	            		var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
	            		var infoWindow = new BMap.InfoWindow(content,opts);  // 创建信息窗口对象 
	            		map.openInfoWindow(infoWindow,point); //开启信息窗口
	            	}
                }
      });
	/* var data_info = [[116.417854,39.921988,"地址：北京市东城区王府井大街88号乐天银泰百货八层"],
					 [116.406605,39.921585,"地址：北京市东城区东华门大街"],
					 [116.412222,39.912345,"地址：北京市东城区正义路甲5号"]
					]; */
	/* var opts = {
				width : 250,     // 信息窗口宽度
				height: 80,     // 信息窗口高度
				title : "信息窗口" , // 信息窗口标题
				enableMessage:true//设置允许信息窗发送短息
			   };
	for(var i=0;i<data_info.length;i++){
		var marker = new BMap.Marker(new BMap.Point(data_info[i][0],data_info[i][1]));  // 创建标注
		var content = data_info[i][2];
		map.addOverlay(marker);               // 将标注添加到地图中
		addClickHandler(content,marker);
	}
	function addClickHandler(content,marker){
		marker.addEventListener("click",function(e){
			openInfo(content,e)}
		);
	}
	function openInfo(content,e){
		var p = e.target;
		var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
		var infoWindow = new BMap.InfoWindow(content,opts);  // 创建信息窗口对象 
		map.openInfoWindow(infoWindow,point); //开启信息窗口
	} */
</script>
</html>
